<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<script src="../js/mui.js"></script>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link href="../css/icons-extra.css" rel="stylesheet" />
		<link href="../css/iconfont.css" rel="stylesheet" type="text/css" />

		<style type="text/css">
			.qirinianhua {
				font-size: 13px;
				color: #9D9D9D;
				"

			}

			.jijinming {
				font-size: 16px;
				color: #272727">

			}
		</style>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav">
			<a class=" mui-icon  mui-pull-left"><span class="mui-icon-extra mui-icon-extra-sweep "></span></a>
			<a href="vtSearch.html">
				<div class="mui-input-row mui-search">
					<input type="search" class="mui-input-clear whiteBg" placeholder="搜索">
				</div>
			</a>
		</header>
		<!-- banner 图 -->
		<div>
			<div class="mui-slider" style="margin-top: 50px;height: 190px;">
				<!-- 轮播图的图片容器 -->
				<div class="mui-slider-group mui-slider-loop">
					<!--支持循环，需要重复图片节点-->
					<div class="mui-slider-item mui-slider-item-duplicate">
						<a href="#">
							<img src="../img/3.jpg" alt="">
						</a>
					</div>
					<div class="mui-slider-item">
						<a href="#">
							<img src="../img/1.jpg" alt="">
						</a>
					</div>
					<div class="mui-slider-item">
						<a href="#">
							<img src="../img/2.jpg" alt="" style="height:194px;">
						</a>
					</div>
					<div class="mui-slider-item">
						<a href="#">
							<img src="../img/3.jpg" alt="" style="height:194px;">
						</a>
					</div>

					<!--支持循环，需要重复图片节点-->
					<div class="mui-slider-item mui-slider-item-duplicate">
						<a href="#">
							<img src="../img/1.jpg" alt="">
						</a>
					</div>
				</div>
				<!-- 轮播图的小圆点容器 -->
				<div class="mui-slider-indicator">
					<div class="mui-indicator mui-active"></div>
					<div class="mui-indicator"></div>
					<div class="mui-indicator"></div>
				</div>
			</div>
		</div>
		<div>
			<div
				style="width: 98%;height: 30px;margin: 5px auto;border:1px solid #E9967A;padding: 2px 2px 2px 2px;border-radius: 5px;">
				<div>
					<span class="mui-icon iconfont icon-laba" style="font-size: 20px;"></span>
					<span style="margin-left: 10px; color:red;">新用户注册立享10元抵用券</span>
				</div>
			</div>
			<div class="mui-content">
				<ul class="mui-table-view mui-grid-view mui-grid-9" id="indexcenter">
					<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#">
							<span class="mui-icon iconfont icon-liwu" style="font-size: 30px;"></span>
							<div class="mui-media-body">新人</div>
						</a></li>
					<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#" id="licaic">
							<span class="mui-icon iconfont icon-tisheng" style="font-size: 33px;"></span>
							<div class="mui-media-body">理财</div>
						</a></li>
					<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a id="zixun">
							<span class="mui-icon iconfont icon-zixun" style="font-size: 33px;"></span>
							<div class="mui-media-body">资讯</div>
						</a></li>
					<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#">
							<span class="mui-icon iconfont icon-public-welfare" style="font-size: 33px;"></span>
							<div class="mui-media-body">公益</div>
						</a></li>
				</ul>
			</div>
			<div>
				<span class="mui-icon iconfont icon-tuijian" style="font-size: 20px;"></span>
				<span style="margin-left: 5px;color: red;">新手推荐</span>
			</div>
			<div style="width: 42%;height: 100px;border:1px solid #E9967A; border-radius: 10px;margin:5px 5px 5px 20px;float: left;"
				id="xstj1">
				<div style="margin:20px 10px 20px 20px;float: left;">
					<span style="font-size: 30px;color: red;">4.26%</span></br>
					<span class="qirinianhua">7日年化收益率</span></br>
					<span class="jijinming">壹基金9月17026</span>
				</div>

			</div>


			<div
				style="width: 42%;height: 100px;border:1px solid #E9967A; border-radius: 10px;margin:5px 5px 5px 15px;float: left;" id="xjtj2">
				<div style="margin:20px 10px 20px 20px;float: left;">
					<span style="font-size: 30px;color: red;">4.68%</span></br>
					<span class="qirinianhua">7日年化收益率</span></br>
					<span class="jijinming">壹基金9月2203</span>
				</div>

			</div>

			<div>
				<span class="mui-icon iconfont icon-zhengzhouyinhangAPPtubiaodiergaolunkuohuachunse-54"
					style="font-size: 25px;"></span>
				<span style="margin-left: 5px;color: red;">热门基金</span>
			</div>

				<div
					style="width: 42%;height: 100px;border:1px solid #E9967A; border-radius: 10px;margin:5px 5px 5px 20px;float: left;" id="rmjj1">
					<div style="margin:20px 10px 20px 20px;float: left;">
						<span style="font-size: 30px;color: red;">6.62%</span></br>
						<span class="qirinianhua">7日年化收益率</span></br>
						<span class="jijinming">轩基金8月1024</span>
					</div>

				</div>


				<div
					style="width: 42%;height: 100px;border:1px solid #E9967A; border-radius: 10px;margin:5px 5px 5px 15px;float: left;" id="rmjj2">
					<div style="margin:20px 10px 20px 20px;float: left;">
						<span style="font-size: 30px;color: red;">6.42%</span></br>
						<span class="qirinianhua">7日年化收益率</span></br>
						<span class="jijinming">轩基金6月1103</span>
					</div>
				</div>
		</div>


	</body>
	<script type="text/javascript">
		document.getElementById('zixun').addEventListener('tap', function() {
			//打开关于页面  
			mui.openWindow({
				url: 'zixun.html',
				// id:'zixun',  
			});
		});

		document.getElementById('licaic').addEventListener('tap', function() {
			//打开关于页面  
			mui.openWindow({
				url: 'licai.html',
				// id:'zixun',  
			});
		});
		
		document.getElementById('xstj1').addEventListener('tap', function() {
			//打开关于页面  
			mui.openWindow({
				url: 'xiangqing.html',
				// id:'zixun',  
			});
		});
	</script>

</html>
